<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta name="csrf-token" content="">
    <meta name="Description"
        content="测速网提供网速测试，网络质量测试，宽带测速，Wi-Fi测速，5G测速，IPv6测速，带宽检测，路由器测速，网关测速，宽带提速，宽带升级，网络加速，内网测速，专网测速，视频测试，游戏测速，直播测速，网络诊断，蹭网检测，物联网监测，网站监测，API监测，Ping测试，路由测试等专业服务，拥有国内外大量高性能测试点，覆盖电信，移动，联通，网通，广电，长城宽带，鹏博士等运营商,Wi-Fi 7,Wi-Fi 6,FTTR,全屋Wi-Fi。">
    <meta name="Keywords"
        content="测速,测网速,网速,网络质量,5G网速,5G测速,5G网络,在线测速,网速测试,宽带测速,视频测试,Wi-Fi测速,联通,电信,移动,长城宽带,广电,鹏博士,网速诊断,网络诊断,蹭网检测,路由测试,上网速度,网页打开速度,游戏测速,直播测速,提高网速,宽带提速,网络加速,速度测试,带宽检测,宽带测试,千兆宽带,双千兆,三千兆,光纤,ping,speedtest,speed,test,adsl,ftth,iot,internet,tracert,traceroute,IPv6,6G,网维助手,Wi-Fi 7,Wi-Fi 6,FTTR,全屋Wi-Fi">
    <meta http-equiv="x-dns-prefetch-control" content="on">
    <meta name="format-detection" content="telephone=no,email=no,address=no">
    <title>测速网 - 专业测网速, 网速测试, 宽带提速, 游戏测速, 直播测速, 5G测速, 物联网监测,Wi-Fi 7,Wi-Fi 6,FTTR,全屋Wi-Fi - SpeedTest.cn</title>
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
    <link rel="shortcut icon" href="/favicon.png">
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <style>
        :root {
            --primary-color: #1890ff;
            --primary-hover: #40a9ff;
            --primary-disabled: #bae7ff;
            --warning-color: #faad14;
            --warning-hover: #ffc53d;
            --warning-disabled: #fff1b8;
            --success-color: #52c41a;
            --success-hover: #73d13d;
            --success-disabled: #d9f7be;
            --error-color: #f5222d;
            --error-hover: #ff4d4f;
            --error-disabled: #ffccc7;
            --text-primary: #262626;
            --text-secondary: #595959;
            --text-disabled: #bfbfbf;
            --border-color: #d9d9d9;
            --background-color: #f0f2f5;
            --card-background: rgba(255, 255, 255, 0.9);
            --shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
            --radius: 12px;
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            color: var(--text-primary);
            line-height: 1.5;
            min-height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 20px;
            position: relative;
            overflow-x: hidden;
        }

        /* 背景样式 */
        body::before {
            content: "";
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: url('https://images.unsplash.com/photo-1518709268805-4e9042af2176?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80') no-repeat center center;
            background-size: cover;
            z-index: -2;
        }

        /* 背景遮罩 */
        body::after {
            content: "";
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, rgba(0, 20, 40, 0.8) 0%, rgba(0, 40, 80, 0.7) 100%);
            z-index: -1;
        }

        /* 动态粒子背景 */
        .particles {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            overflow: hidden;
        }

        .particle {
            position: absolute;
            background-color: rgba(255, 255, 255, 0.3);
            border-radius: 50%;
            pointer-events: none;
            animation: float linear infinite;
        }

        @keyframes float {
            0% {
                transform: translateY(0) translateX(0);
                opacity: 0;
            }

            10% {
                opacity: 1;
            }

            90% {
                opacity: 1;
            }

            100% {
                transform: translateY(-100vh) translateX(100px);
                opacity: 0;
            }
        }

        .container {
            max-width: 900px;
            width: 100%;
            background-color: var(--card-background);
            backdrop-filter: blur(10px);
            border-radius: var(--radius);
            box-shadow: var(--shadow);
            padding: 40px;
            border: 1px solid rgba(255, 255, 255, 0.2);
            animation: fadeIn 0.8s ease-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .header {
            text-align: center;
            margin-bottom: 30px;
            padding-bottom: 20px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        }

        .header h1 {
            font-size: 32px;
            font-weight: 700;
            color: white;
            margin-bottom: 10px;
            text-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            background: linear-gradient(135deg, #8f8585 0%, #1e5d9d 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .header p {
            color: #333;
            font-size: 16px;
        }

        .test-content {
            text-align: center;
        }

        .button-group {
            display: flex;
            justify-content: center;
            gap: 15px;
            margin-bottom: 30px;
        }

        .test-button,
        .pause-button,
        .restart-button {
            padding: 14px 28px;
            border-radius: var(--radius);
            cursor: pointer;
            font-size: 15px;
            font-weight: 600;
            transition: all 0.3s;
            border: none;
            display: flex;
            align-items: center;
            gap: 10px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        }

        .test-button {
            background: linear-gradient(135deg, #1890ff 0%, #36cfc9 100%);
            color: white;
        }

        .test-button:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(24, 144, 255, 0.4);
        }

        .test-button:disabled {
            background: linear-gradient(135deg, #bae7ff 0%, #b5f5ec 100%);
            cursor: not-allowed;
            color: var(--text-disabled);
            transform: none;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        }

        .pause-button {
            background: linear-gradient(135deg, #faad14 0%, #ffd666 100%);
            color: white;
        }

        .pause-button:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(250, 173, 20, 0.4);
        }

        .pause-button:disabled {
            background: linear-gradient(135deg, #fff1b8 0%, #fffbe6 100%);
            cursor: not-allowed;
            color: var(--text-disabled);
            transform: none;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        }

        .restart-button {
            background: linear-gradient(135deg, #52c41a 0%, #95de64 100%);
            color: white;
        }

        .restart-button:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(82, 196, 26, 0.4);
        }

        .restart-button:disabled {
            background: linear-gradient(135deg, #d9f7be 0%, #f6ffed 100%);
            cursor: not-allowed;
            color: var(--text-disabled);
            transform: none;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        }

        .progress-container {
            margin: 30px 0;
            display: none;
            padding: 25px;
            background-color: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(5px);
            border-radius: var(--radius);
            border: 1px solid rgba(255, 255, 255, 0.3);
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        }

        .progress-info {
            display: flex;
            justify-content: space-between;
            margin-bottom: 15px;
            font-size: 14px;
            font-weight: 600;
        }

        .current-speed {
            color: var(--primary-color);
        }

        .progress-bar-container {
            position: relative;
            height: 14px;
            background-color: rgba(0, 0, 0, 0.05);
            border-radius: 7px;
            overflow: hidden;
            margin-bottom: 15px;
        }

        .progress {
            height: 100%;
            background: linear-gradient(90deg, #1890ff 0%, #36cfc9 100%);
            width: 0%;
            transition: width 0.3s ease;
            border-radius: 7px;
            box-shadow: 0 0 10px rgba(24, 144, 255, 0.5);
        }

        .progress-text {
            color: var(--text-secondary);
            font-size: 14px;
            margin-top: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }

        .chart-container {
            margin: 30px 0;
            height: 300px;
            display: none;
            padding: 25px;
            background-color: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(5px);
            border-radius: var(--radius);
            border: 1px solid rgba(255, 255, 255, 0.3);
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        }

        .test-result {
            margin-top: 30px;
            display: none;
            text-align: left;
            padding: 25px;
            background-color: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(5px);
            border-radius: var(--radius);
            border: 1px solid rgba(255, 255, 255, 0.3);
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        }

        .test-result h3 {
            font-size: 20px;
            font-weight: 600;
            margin-bottom: 20px;
            color: var(--text-primary);
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .result-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            gap: 15px;
        }

        .result-item {
            background-color: rgba(255, 255, 255, 0.9);
            padding: 20px;
            border-radius: var(--radius);
            border: 1px solid rgba(255, 255, 255, 0.3);
            transition: all 0.3s;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        }

        .result-item:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        }

        .result-label {
            font-size: 13px;
            color: var(--text-secondary);
            margin-bottom: 8px;
            font-weight: 500;
        }

        .result-value {
            font-size: 24px;
            font-weight: 700;
            color: var(--text-primary);
            background: linear-gradient(135deg, #1890ff 0%, #36cfc9 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .message {
            margin-top: 20px;
            padding: 15px 20px;
            border-radius: var(--radius);
            display: none;
            font-size: 14px;
            display: flex;
            align-items: center;
            gap: 10px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        }

        .success {
            background: linear-gradient(135deg, rgba(82, 196, 26, 0.1) 0%, rgba(149, 222, 100, 0.1) 100%);
            color: var(--success-color);
            border: 1px solid rgba(82, 196, 26, 0.2);
        }

        .error {
            background: linear-gradient(135deg, rgba(245, 34, 45, 0.1) 0%, rgba(255, 77, 79, 0.1) 100%);
            color: var(--error-color);
            border: 1px solid rgba(245, 34, 45, 0.2);
        }

        .warning {
            background: linear-gradient(135deg, rgba(250, 173, 20, 0.1) 0%, rgba(255, 214, 102, 0.1) 100%);
            color: var(--warning-color);
            border: 1px solid rgba(250, 173, 20, 0.2);
        }

        .spinner {
            display: inline-block;
            width: 16px;
            height: 16px;
            border: 2px solid rgba(255, 255, 255, 0.3);
            border-radius: 50%;
            border-top-color: white;
            animation: spin 1s ease-in-out infinite;
        }

        @keyframes spin {
            to {
                transform: rotate(360deg);
            }
        }

        .completed-icon {
            color: var(--success-color);
            font-size: 18px;
        }

        .footer {
            margin-top: 30px;
            text-align: center;
            color: rgb(65 60 60 / 60%);
            font-size: 12px;
            padding-top: 20px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
        }

        @media (max-width: 768px) {
            .container {
                padding: 25px;
            }

            .button-group {
                flex-direction: column;
                align-items: center;
            }

            .test-button,
            .pause-button,
            .restart-button {
                width: 100%;
                max-width: 300px;
                justify-content: center;
            }
        }
    </style>
</head>

<body>
    <!-- 动态粒子背景 -->
    <div class="particles" id="particles"></div>

    <div class="container">
        <div class="header">
            <h1>网络速度测试工具</h1>
            <p>测试您的网络下载速度，获取详细的性能分析报告</p>
        </div>

        <div class="test-content">
            <div class="button-group">
                <button id="testButton" class="test-button">
                    <i class="fas fa-play"></i>
                    <span>开始测试</span>
                </button>
                <button id="pauseButton" class="pause-button" disabled>
                    <i class="fas fa-pause"></i>
                    <span>暂停测试</span>
                </button>
                <button id="restartButton" class="restart-button" disabled>
                    <i class="fas fa-redo"></i>
                    <span>重新测试</span>
                </button>
            </div>

            <div id="progressContainer" class="progress-container">
                <div class="progress-info">
                    <div class="current-speed">当前速度: <span id="currentSpeed">0.00</span> Mbps</div>
                    <div class="progress-percent"><span id="progressPercent">0</span>%</div>
                </div>
                <div class="progress-bar-container">
                    <div id="progress" class="progress"></div>
                </div>
                <div id="progressText" class="progress-text">
                    <i class="fas fa-download"></i>
                    <span>正在下载测试文件，请稍候...</span>
                </div>
            </div>

            <div id="chartContainer" class="chart-container">
                <canvas id="speedChart"></canvas>
            </div>

            <div id="testResult" class="test-result">
                <h3>
                    <i class="fas fa-chart-line"></i>
                    <span>测试结果</span>
                </h3>
                <div class="result-grid">
                    <div class="result-item">
                        <div class="result-label">平均下载速度</div>
                        <div class="result-value" id="avgSpeedResult">-</div>
                    </div>
                    <div class="result-item">
                        <div class="result-label">最高下载速度</div>
                        <div class="result-value" id="maxSpeedResult">-</div>
                    </div>
                    <div class="result-item">
                        <div class="result-label">文件大小</div>
                        <div class="result-value" id="fileSizeResult">-</div>
                    </div>
                    <div class="result-item">
                        <div class="result-label">下载用时</div>
                        <div class="result-value" id="durationResult">-</div>
                    </div>
                </div>
            </div>

            <div id="message" class="message"></div>
        </div>

        <div class="footer">
            <p>© 2023 网络速度测试工具 | 专业网络性能分析</p>
        </div>
    </div>

    <script>
        document.addEventListener('DOMContentLoaded', function () {
            // 创建动态粒子背景
            createParticles();

            const testButton = document.getElementById('testButton');
            const pauseButton = document.getElementById('pauseButton');
            const restartButton = document.getElementById('restartButton');
            const progressContainer = document.getElementById('progressContainer');
            const progress = document.getElementById('progress');
            const progressPercent = document.getElementById('progressPercent');
            const progressText = document.getElementById('progressText');
            const currentSpeed = document.getElementById('currentSpeed');
            const chartContainer = document.getElementById('chartContainer');
            const testResult = document.getElementById('testResult');
            const avgSpeedResult = document.getElementById('avgSpeedResult');
            const maxSpeedResult = document.getElementById('maxSpeedResult');
            const fileSizeResult = document.getElementById('fileSizeResult');
            const durationResult = document.getElementById('durationResult');
            const message = document.getElementById('message');

            // 测试文件URL，可以替换为任何较大的文件URL
            // const testFileUrl = 'https://android-apps.pp.cn/fs08/2025/08/14/11/1_7d97f36afa399172f6d4c93a0c7c23a8.apk?yingid=web_space&packageid=501185850&md5=6e3a205aa70c869b5de0d65f76916471&minSDK=23&size=316039252&shortMd5=e187b9427074198d44463e916b63116d&crc32=340728777&did=0167c5c33ac9d8f47fd6c6c730e86853&nrd=0'; // 10MB的测试图片
            const testFileUrl = 'https://mp-54d25869-6f9e-4a94-ae8f-388997b47956.cdn.bspapp.com/speedtest.apk'; // 10MB的测试图片

            // 测试状态
            let testState = {
                isRunning: false,
                isPaused: false,
                reader: null,
                response: null,
                startTime: 0,
                lastUpdateTime: 0,
                lastLoadedBytes: 0,
                receivedLength: 0,
                contentLength: 0,
                maxSpeed: 0,
                totalSpeed: 0,
                speedCount: 0,
                pauseTime: 0,
                totalPausedTime: 0
            };

            // 图表相关变量
            let speedChart = null;
            let speedData = [];
            let timeLabels = [];

            // 事件监听
            testButton.addEventListener('click', startSpeedTest);
            pauseButton.addEventListener('click', togglePauseTest);
            restartButton.addEventListener('click', restartSpeedTest);

            function createParticles() {
                const particlesContainer = document.getElementById('particles');
                const particleCount = 50;

                for (let i = 0; i < particleCount; i++) {
                    createParticle(particlesContainer);
                }
            }

            function createParticle(container) {
                const particle = document.createElement('div');
                particle.className = 'particle';

                // 随机大小
                const size = Math.random() * 5 + 2;
                particle.style.width = `${size}px`;
                particle.style.height = `${size}px`;

                // 随机位置
                const posX = Math.random() * window.innerWidth;
                const posY = Math.random() * window.innerHeight;
                particle.style.left = `${posX}px`;
                particle.style.top = `${posY}px`;

                // 随机动画时长和延迟
                const duration = Math.random() * 20 + 10;
                const delay = Math.random() * 5;
                particle.style.animationDuration = `${duration}s`;
                particle.style.animationDelay = `${delay}s`;

                container.appendChild(particle);

                // 动画结束后重新创建粒子
                setTimeout(() => {
                    particle.remove();
                    createParticle(container);
                }, (duration + delay) * 1000);
            }

            function initChart() {
                const ctx = document.getElementById('speedChart').getContext('2d');

                // 如果已存在图表，先销毁
                if (speedChart) {
                    speedChart.destroy();
                }

                // 重置数据
                speedData = [];
                timeLabels = [];

                // 创建新图表
                speedChart = new Chart(ctx, {
                    type: 'line',
                    data: {
                        labels: timeLabels,
                        datasets: [{
                            label: '下载速度 (Mbps)',
                            data: speedData,
                            borderColor: '#1890ff',
                            backgroundColor: 'rgba(24, 144, 255, 0.1)',
                            borderWidth: 2,
                            tension: 0.3,
                            fill: true
                        }]
                    },
                    options: {
                        responsive: true,
                        maintainAspectRatio: false,
                        scales: {
                            y: {
                                beginAtZero: true,
                                title: {
                                    display: true,
                                    text: '速度 (Mbps)'
                                }
                            },
                            x: {
                                title: {
                                    display: true,
                                    text: '时间 (秒)'
                                }
                            }
                        },
                        plugins: {
                            legend: {
                                display: true,
                                position: 'top'
                            },
                            tooltip: {
                                mode: 'index',
                                intersect: false
                            }
                        }
                    }
                });
            }

            async function startSpeedTest() {
                if (testState.isRunning) return;

                // 重置UI
                testButton.disabled = true;
                pauseButton.disabled = false;
                restartButton.disabled = false;
                progressContainer.style.display = 'block';
                chartContainer.style.display = 'none';
                testResult.style.display = 'none';
                progress.style.width = '0%';
                progressPercent.textContent = '0';
                currentSpeed.textContent = '0.00';
                progressText.innerHTML = '<i class="fas fa-download"></i><span>正在测试下载速度，请稍候...</span>';
                hideMessage();

                try {
                    // 初始化图表
                    initChart();
                    chartContainer.style.display = 'block';

                    // 重置测试状态
                    testState = {
                        isRunning: true,
                        isPaused: false,
                        reader: null,
                        response: null,
                        startTime: new Date().getTime(),
                        lastUpdateTime: new Date().getTime(),
                        lastLoadedBytes: 0,
                        receivedLength: 0,
                        contentLength: 0,
                        maxSpeed: 0,
                        totalSpeed: 0,
                        speedCount: 0,
                        pauseTime: 0,
                        totalPausedTime: 0
                    };

                    // 使用fetch API下载文件
                    try {
                        testState.response = await fetch(testFileUrl, {
                            mode: 'cors',
                            credentials: 'omit'
                        });

                        if (!testState.response.ok) {
                            throw new Error(`HTTP error! status: ${testState.response.status}`);
                        }
                    } catch (error) {
                        if (error.name === 'TypeError' && error.message.includes('Failed to fetch')) {
                            throw new Error('跨域请求失败，请使用支持CORS的测试文件');
                        }
                        throw error;
                    }


                    // 获取文件大小
                    testState.contentLength = testState.response.headers.get('Content-Length');
                    const fileSizeInMB = (testState.contentLength / (1024 * 1024)).toFixed(2);

                    // 读取响应数据
                    testState.reader = testState.response.body.getReader();

                    // 开始下载循环
                    await downloadLoop();

                    // 计算下载用时和平均速度
                    const endTime = new Date().getTime();
                    const actualDuration = ((endTime - testState.startTime - testState.totalPausedTime) / 1000).toFixed(2); // 转换为秒，减去暂停时间
                    const avgSpeed = testState.speedCount > 0 ? (testState.totalSpeed / testState.speedCount).toFixed(2) : '0.00';

                    // 更新进度文本为完成状态
                    progressText.innerHTML = '<i class="fas fa-check-circle completed-icon"></i><span>测试完成！</span>';

                    // 显示测试结果
                    avgSpeedResult.textContent = avgSpeed + ' Mbps';
                    maxSpeedResult.textContent = testState.maxSpeed.toFixed(2) + ' Mbps';
                    fileSizeResult.textContent = fileSizeInMB + ' MB';
                    durationResult.textContent = actualDuration + ' 秒';
                    testResult.style.display = 'block';

                    showMessage('测试完成！您的网络速度测试已成功完成。', 'success');
                } catch (error) {
                    console.error('Speed test failed:', error);
                    progressText.innerHTML = '<i class="fas fa-exclamation-circle" style="color: var(--error-color)"></i><span>测试失败</span>';
                    showMessage('测试失败: ' + error.message, 'error');
                } finally {
                    testState.isRunning = false;
                    testButton.disabled = false;
                    pauseButton.disabled = true;
                    pauseButton.innerHTML = '<i class="fas fa-pause"></i><span>暂停测试</span>';
                }
            }

            async function downloadLoop() {
                while (testState.isRunning) {
                    if (testState.isPaused) {
                        // 如果暂停，等待一段时间再检查
                        await new Promise(resolve => setTimeout(resolve, 100));
                        continue;
                    }

                    const { done, value } = await testState.reader.read();

                    if (done) break;

                    testState.receivedLength += value.length;

                    // 计算当前速度
                    const currentTime = new Date().getTime();
                    const timeDiff = (currentTime - testState.lastUpdateTime) / 1000; // 转换为秒

                    // 每秒更新一次速度
                    if (timeDiff >= 1) {
                        const bytesDiff = testState.receivedLength - testState.lastLoadedBytes;
                        const speedMbps = ((bytesDiff * 8) / (timeDiff * 1000000)).toFixed(2);

                        // 更新当前速度显示
                        currentSpeed.textContent = speedMbps;

                        // 记录最高速度
                        if (parseFloat(speedMbps) > testState.maxSpeed) {
                            testState.maxSpeed = parseFloat(speedMbps);
                        }

                        // 累计速度用于计算平均值
                        testState.totalSpeed += parseFloat(speedMbps);
                        testState.speedCount++;

                        // 更新图表数据
                        const elapsedTime = ((currentTime - testState.startTime - testState.totalPausedTime) / 1000).toFixed(1);
                        timeLabels.push(elapsedTime);
                        speedData.push(parseFloat(speedMbps));

                        // 更新图表
                        speedChart.update();

                        // 更新最后记录的时间和字节数
                        testState.lastUpdateTime = currentTime;
                        testState.lastLoadedBytes = testState.receivedLength;
                    }

                    // 更新进度条
                    const percentComplete = Math.round((testState.receivedLength / testState.contentLength) * 100);
                    progress.style.width = percentComplete + '%';
                    progressPercent.textContent = percentComplete;
                }
            }

            function togglePauseTest() {
                if (!testState.isRunning) return;

                testState.isPaused = !testState.isPaused;

                if (testState.isPaused) {
                    // 记录暂停时间
                    testState.pauseTime = new Date().getTime();
                    pauseButton.innerHTML = '<i class="fas fa-play"></i><span>继续测试</span>';
                    progressText.innerHTML = '<i class="fas fa-pause-circle" style="color: var(--warning-color)"></i><span>测试已暂停，点击继续按钮恢复测试</span>';
                    showMessage('测试已暂停', 'warning');
                } else {
                    // 计算暂停时长并累加
                    const currentTime = new Date().getTime();
                    testState.totalPausedTime += currentTime - testState.pauseTime;

                    // 更新最后更新时间，避免暂停影响速度计算
                    testState.lastUpdateTime = currentTime;

                    pauseButton.innerHTML = '<i class="fas fa-pause"></i><span>暂停测试</span>';
                    progressText.innerHTML = '<i class="fas fa-download"></i><span>正在下载测试文件，请稍候...</span>';
                    hideMessage();

                    // 继续下载循环
                    downloadLoop();
                }
            }

            function restartSpeedTest() {
                // 如果测试正在运行，先停止
                if (testState.isRunning) {
                    testState.isRunning = false;
                    testState.isPaused = false;

                    // 取消正在进行的读取操作
                    if (testState.reader) {
                        testState.reader.cancel();
                    }
                }

                // 重置UI
                testButton.disabled = false;
                pauseButton.disabled = true;
                pauseButton.innerHTML = '<i class="fas fa-pause"></i><span>暂停测试</span>';
                restartButton.disabled = true;
                progressContainer.style.display = 'none';
                chartContainer.style.display = 'none';
                testResult.style.display = 'none';
                hideMessage();

                showMessage('测试已重置，可以重新开始', 'success');
            }

            function showMessage(text, type) {
                message.innerHTML = '';

                // 添加图标
                let icon = '';
                if (type === 'success') {
                    icon = '<i class="fas fa-check-circle"></i>';
                } else if (type === 'error') {
                    icon = '<i class="fas fa-exclamation-circle"></i>';
                } else if (type === 'warning') {
                    icon = '<i class="fas fa-exclamation-triangle"></i>';
                }

                message.innerHTML = icon + '<span>' + text + '</span>';
                message.className = 'message ' + type;
                message.style.display = 'flex';
            }

            function hideMessage() {
                message.style.display = 'none';
            }
        });
    </script>
</body>

</html>